<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>遍历</title>
</head>
<body>
    <input type="button" id="btn" value="遍历列表项">
    <ul>
        <li>传智播客</li>
        <li>黑马程序员</li>
        <li>传智专修学院</li>
    </ul>
</body>
<script src="js/jquery-3.3.1.min.js"></script>
<script>
    //方式一：传统方式
    console.log("传统方式(js方式)");
    for(let i=0;i<$("li").length;i++){
         //console.log($("li")[i].innerHTML);
        //需求 :如果值是 黑马程序员 ,则跳过当前循环,继续下一次循环
        if($("li")[i].innerHTML=="黑马程序员"){
            continue;
        }
        console.log($("li")[i].innerHTML);
      }

    //方式二：对象.each()方法
    console.log("对象.each()方法(jQuery方式)");
    /*
           i:参数1 表示索引
           el:参数2,表示遍历出来的元素对象,是一个js对象
          this:表示遍历出来的元素对象,是一个js对象;如果需要转换成jquery对象那么就需要$(this)
    */


    $("li").each(function (i,el) {
       //  console.log(`$(i)---->$(el.innerHTML)`);
        //console.log(this.innerHTML);
        //console.log($(this).html())


    //需求 :如果值是 黑马程序员 ,则跳过当前循环,继续下一次循环
  /*  if($(this).html()=="黑马程序员") {
        //continue; //不支持,报错,jquery使用return ture 代替continue
         return true;
    }
    console.log($(this).html());
 */

    //需求2:如果值是"黑马程序员",则结束循环
        if($(this).html()=="黑马程序员"){
            //break;//不支持,报错,jquery使用return false代替break
            return false ;
        }
    console.log($(this).html());
    })
    //方式三：$.each()方法


    //方式四：for of 语句遍历
    console.log("for of 语句遍历(js方式)");
    for(let li of $("li")){
        console.log(li.innerHTML);
    }

</script>
</html>